---
icon: FileIcon
sidebarTitle: page.mdx
description:
  The `page.mdx` file in Nextra is a special Next.js App Router convention file
  that allows you to define UI unique to a route. By default, `.js`, `.jsx`, or
  `.tsx` file extensions can be used for `page`, and Nextra enhances them with
  `.md` and `.mdx` extensions.
---

import { FileTree } from 'nextra/components'

# `page.mdx` File

[`page` file](https://nextjs.org/docs/app/api-reference/file-conventions/page)
is a special
[Next.js App Router convention file](https://nextjs.org/docs/app/getting-started/project-structure#routing-files)
which allows you to define UI that is unique to a route:

<FileTree>
  <FileTree.Folder name="app" open>
    <FileTree.File name="layout.jsx" />
    <FileTree.File name="page.jsx" active />
    <FileTree.Folder name="docs" open>
      <FileTree.File name="page.mdx" active />
      <FileTree.Folder name="getting-started" open>
        <FileTree.File name="page.mdx" active />
      </FileTree.Folder>
    </FileTree.Folder>
  </FileTree.Folder>
</FileTree>

> [!TIP]
>
> By default, the `.js`, `.jsx`, or `.tsx` file extensions can be used for
> `page`.<br/> Nextra enhance them with `.md` and `.mdx` extensions.
